<template>
  <BaseTable
    :data="rows"
    :columns="cols"
    :selection="true"
    :index="true"
    :pager="pager"
    @update:pager="pager = $event"
    @selection-change="sel => (selection = sel)"
  >
    <template #actions="{ row }">
      <el-button type="text" @click="edit(row)">编辑</el-button>
    </template>
  </BaseTable>
</template>

<script>
import BaseTable from '@/components/tabel/index.vue';

export default {
  components: { BaseTable },
  data() {
    return {
      rows: [{ id:1, name:'张三', age:28 }, { id:2, name:'李四', age:32 }],
      cols: [
        { prop:'name', label:'姓名', minWidth: 140 },
        { prop:'age', label:'年龄', minWidth: 100, sortable: true },
        { prop:'id',  label:'ID',   minWidth: 120, formatter:(r)=>`#${r.id}` },
        { prop:'_',   label:'操作', minWidth: 160, slot:'actions', align:'center' }
      ],
      pager: { page: 1, pageSize: 10, total: 2 },
      selection: []
    };
  },
  methods: { edit(row){ console.log(row); } }
};
</script>